import useHotKeys from '@/hooks/useHotKeys'
import useEditorStore from '@/store/modules/editorStore'
import pinia from '@/store'
import { computed } from 'vue'
import type { KeyHandler, HotkeysEvent } from 'hotkeys-js'
const editorStore = useEditorStore(pinia)
// 定义一个函数warp，接收一个参数callback，类型为KeyHandler
const warp = (callback: KeyHandler) => {
  // 定义一个函数warpFn，接收两个参数e和event，类型分别为KeyboardEvent和HotkeysEvent
  const warpFn = (e: KeyboardEvent, event: HotkeysEvent) => {
    // 阻止默认事件
    e.preventDefault()
    // 调用callback函数，传入e和event参数
    callback(e, event)
  }
  // 返回warpFn函数
  return warpFn
}
const initHotKeys = () => {
  const copyComponentId = computed(() => {
    return editorStore.currentComponentId
  })
  useHotKeys('ctrl+c,command+c', () => {
    editorStore.copyComponentHandle(copyComponentId.value)
  })
  useHotKeys('ctrl+v,command+v', () => {
    editorStore.pasteComponent()
  })
  useHotKeys('delete, backspace', () => {
    editorStore.deleteComponentHandle(copyComponentId.value)
  })
  useHotKeys('escape, esc', () => {
    editorStore.setActiveComponent('')
  })
  useHotKeys(
    'up',
    warp(() => {
      editorStore.moveComponentByKey({
        direction: 'Up',
        id: copyComponentId.value,
        moveSize: 1,
      })
    })
  )
  useHotKeys(
    'down',
    warp(() => {
      editorStore.moveComponentByKey({
        direction: 'Down',
        id: copyComponentId.value,
        moveSize: 1,
      })
    })
  )
  useHotKeys(
    'left',
    warp(() => {
      editorStore.moveComponentByKey({
        direction: 'Left',
        id: copyComponentId.value,
        moveSize: 1,
      })
    })
  )
  useHotKeys(
    'right',
    warp(() => {
      editorStore.moveComponentByKey({
        direction: 'Right',
        id: copyComponentId.value,
        moveSize: 1,
      })
    })
  )
  useHotKeys('shift+up', () => {
    editorStore.moveComponentByKey({
      direction: 'Up',
      id: copyComponentId.value,
      moveSize: 10,
    })
  })
  useHotKeys('shift+down', () => {
    editorStore.moveComponentByKey({
      direction: 'Down',
      id: copyComponentId.value,
      moveSize: 10,
    })
  })
  useHotKeys('shift+left', () => {
    editorStore.moveComponentByKey({
      direction: 'Left',
      id: copyComponentId.value,
      moveSize: 10,
    })
  })
  useHotKeys('shift+right', () => {
    editorStore.moveComponentByKey({
      direction: 'Right',
      id: copyComponentId.value,
      moveSize: 10,
    })
  })
  //撤销
  useHotKeys('ctrl+z,command+z', () => {
    editorStore.undo()
  })
  //重做
  useHotKeys('ctrl+y,command+shift+z', () => {
    editorStore.redo()
  })
}

export default initHotKeys
